/*-----------------------------
    @MEDIA
-----------------------------*/
@media all and (max-width: 768px) {
    body,
    section,
    section > div,
    [data-editable="text"] > div,
    [data-section="wrap"],
    [data-editable] {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    section {
        height: auto !important;
        /*background-size: 100% !important;*/
        background-repeat: no-repeat;
        overflow: visible !important;
    }

    [data-reverse="true"] {
        display: -webkit-box;
        display: box;
        -webkit-box-direction: reverse;
        box-direction: reverse;
        -webkit-box-orient: vertical;
        box-orient: vertical;

        display: -webkit-flex;
        display:    -moz-flex;
        display:     -ms-flex;
        display:      -o-flex;
        display:         flex;
        -webkit-flex-direction: column-reverse;
        -moz-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
        -o-flex-direction: column-reverse;
        flex-direction: column-reverse;

        -webkit-justify-content: flex-end;
        -moz-justify-content: flex-end;
        -ms-justify-content: flex-end;
        justify-content: flex-end;
    }

    [data-editable="box"],
    [data-editable="boxCookieNotification"] {
        position: relative !important;
        top: auto;
        left: auto;
        margin: auto;
        /*display: -webkit-flex;
        display:    -moz-flex;
        display:     -ms-flex;
        display:      -o-flex;
        display:         flex;
        -webkit-flex-direction: column-reverse;
           -moz-flex-direction: column-reverse;
            -ms-flex-direction: column-reverse;
             -o-flex-direction: column-reverse;
                flex-direction: column-reverse;*/
    }

    [data-section="wrap"],
    [data-editable="webform"],
    [data-editable="webinar"],
    [data-editable] {
        font-size: 100% !important;
        position: relative !important;
        top: 0 !important;
        left: auto !important;
        right: auto !important;
        margin: 0 auto !important;
        max-width: 480px !important;
        width: 100% !important;
        height: auto !important;
        /*display: table !important;*/
    }

    [data-editable="boxCookieNotification"] {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0.4em;
    }

    [data-editable="text"] > div,
    [data-editable="button"],
    div[data-editable="webform"] button,
    [data-editable="webinarButton"] button {
        padding: 4%;
    }

    [data-editable="button"],
    div[data-editable="webform"] button,
    [data-editable="webinarButton"] button {
        padding-right: 0;
        padding-left: 0;
        font-size: inherit !important;
    }

    [data-editable="webform"],
    [data-editable="box"],
    [data-editable="webinarButton"]{
        margin: 4% auto !important;
    }

    [data-section="wrap"] {
        padding: 4% 0;
    }

    [data-editable="multimedia:image"] {
        background-image: none !important;
        text-align: center;
    }

    [data-editable="multimedia:image"] img {
        position: relative !important;
        width: 100% !important;
        height: auto !important;
        margin: auto !important;
        top: auto !important;
        left: auto !important;
    }

    div[data-editable="webform"] form {
        width: auto !important;
        height: auto !important;
    }

    div[data-editable="webform"] .wf-item {
        text-align: center;
        position: relative !important;
        top: auto !important;
        margin: 0 auto !important;
    }

    div[data-editable="webform"] .wf-item,
    div[data-editable="webform"] .wf-item .wf-item-pos {
        position: relative !important;
    }

    div[data-editable="webform"] .wf-item .wf-item-pos {
        left: auto !important;
        margin: 10px auto 0;
        display: inline-block;
        width: 100%;
    }

    .image-mask {
        width: auto !important
    }

    div[data-editable="button"] button,
    [data-editable="buttonCookieNotification"] button,
    [data-editable="webinarButton"] button {
        position: initial !important;
        height: auto !important;
    }

    [data-editable="buttonCookieNotification"] {
        max-width: 300px !important;
        height: auto !important;
        margin-top: 25px !important;
    }

    [data-editable="video"] {
        width: 480px !important;
        height: 360px !important;
    }

    /*[data-editable="box"] [data-editable] {
        display: inline-block !important;
        max-width: 100%;
        width: auto !important;
    }*/

    [data-editable="boxCookieNotification"] {
        position: fixed !important;
    }
}

@media all and (max-width: 600px) {
    [data-editable="video"] {
        width: 480px !important;
        height: 360px !important;
    }
}

@media all and (max-width: 480px) {
    div[data-editable="webform"] .wf-item .wf-item-pos > div {
        width: 100% !important;
    }

    [data-editable="video"] {
        width: 360px !important;
        height: 270px !important;
    }
}

@media all and (max-width: 360px) {
    [data-editable="video"] {
        width: 330px !important;
        height: 233px !important;
    }
}

@media all and (max-width: 320px) {
    [data-section] {
        background-size: 100% !important;
    }

    [data-section="wrap"],
    [data-editable="webform"],
    [data-editable] {
        max-width: 290px !important;
    }

    [data-editable="boxCookieNotification"] {
        max-width: 100% !important;
        padding: 1em;
    }

    [data-editable="video"] {
        width: 290px !important;
        height: 214px !important;
    }

    div[data-editable="webform"] {
        display: table;
    }

    [data-editable="webinar"].no-webinar .widget-tab[data-nowebinar-msg]:before {
        border-width: 1px;
    }
    [data-editable="webinar"].no-webinar .widget-tab[data-nowebinar-msg]:after {
        position: relative;
        width: 92%;
        top: auto;
        transform: none;
        display: inline-block;
        padding: 4%;
    }
}